<template>
    <!-- 滑动框架 -->
    <scroll ref="scroll" class="scroll-content">
        <div class="scroll-warpper">
            <ul v-show="data">
                <li class="item" v-for="(item, index) in data">
                    <router-link :to="'/hsfault?bid='+item.brand_id+'&mid='+item.model_id" class="item-link">
                        <div class="title">{{item.brand}} {{item.model}}</div>
                        <div class="price">最高：￥{{item.top_price}}</div>
                        <span class="icon iconfont icon-enter"></span>
                    </router-link>
                </li>
            </ul>
        </div>
    </scroll>
</template>

<script>
import Scroll from '../../base/scroll/scroll.vue'       //缓动框架

export default {
    data() {
        return {}
    },
    props: {
        data: {
            type: Array,
            default: []
        }
    },
    components: {Scroll},
    methods: {}
}
</script>
<style  lang="less" scoped>
    @import "../../common/less/variable.less";
    .scroll-content{
        position:fixed;
        left:0;
        top:50px;
        bottom:0;
        width:100%;
        overflow:hidden;
        background:#fff;
        z-index:18;
        .scroll-warpper{
            padding:0 10px;
            box-sizing:border-box;
            .item{
                height:50px;
                line-height:50px;
                border-bottom:1px solid @color-alert-line;
                box-sizing:border-box;
                &:last-child{
                    border:none;
                }
                .item-link{
                    display:flex;
                    .title{
                        color:@color-alert-title;
                        font-size:14px;
                    }
                    .price{
                        font-size:10px;
                        margin-left:10px;
                        color:@color-red;
                    }
                    span{
                        flex: 1;
                        text-align: right;
                    }
                }
            }
        }
    }
</style>
